﻿@{
    ViewBag.Title = "ProductShow";
}
<head>
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/ProductShow.css")
    <title></title>
</head>
@*<div class="container">
    <ul class="nav navbar-nav">
        <li class="">
            <a href="" class="">影视 </a>
        </li>
        <li class="">
            <a href="" class=" ">游戏 </a>
        </li>
        <li class="">
            <a href="" class="">模型 </a>
        </li>
        <li class="">
            <a href="" class="">手工 </a>
        </li>
    </ul>
</div>
<div class="container">
    <div class="row">
        <div class="twopage-courses col-md-4">
            <a href="www.baidu.com">
                <img style="width:100%;height:100%" src="@Url.Content("~/Images/product_1.jpg")" alt="" />
                <div class="classicon">
                    <h1><strong>「作品一」</strong></h1>
                   
                </div>
            </a>
        </div>
        <div class="twopage-courses col-md-4">
            <a href="www.baidu.com">
                <img style="width:100%;height:100%" src="@Url.Content("~/Images/product_1.jpg")" alt="" />
                <div class="classicon">
                    <h1><strong>「作品二」</strong></h1>
                </div>
            </a>
        </div>
        <div class="twopage-courses col-md-4">
            <a href="www.baidu.com">
                <img style="width:100%;height:100%" src="@Url.Content("~/Images/product_1.jpg")" alt="" />
                <div class="classicon">
                    <img style="width:100px;height:50px;margin-top:100px;" src="images/logopng版.png" alt="Alternate Text" />
                    <h1><strong>「作品三」</strong></h1>
                </div>
            </a>
        </div>
    </div>

    <div class="row">
        <div class="text-center article-text col-md-4 col-md-offset-4" style="background-color: #ccc; margin-top: 100px; margin-bottom:20px;">
            专业视频
        </div>
    </div>

    <div class="products col-md-4">
        <a class="pro" href="">
            <img class="proimage" src="@Url.Content("~/Images/product_1.jpg")" alt="Alternate Text" />
        </a>
    </div>
    <div class="products col-md-4">
        <a class="pro" href="">
            <img class="proimage" src="@Url.Content("~/Images/product_1.jpg")" alt="Alternate Text" />
        </a>
    </div>
</div>*@
<div class="container-fluid">
    <div class="row-fluid">
        <div class="span12">
            <div class="carousel slide" id="carousel-635530">
                <ol class="carousel-indicators">
                    <li data-slide-to="0" data-target="#carousel-635530">
                    </li>
                    <li data-slide-to="1" data-target="#carousel-635530">
                    </li>
                    <li data-slide-to="2" data-target="#carousel-635530" class="active">
                    </li>
                </ol>
                <div class="carousel-inner">
                    <div class="item">
                        <img alt="" src="@Url.Content("~/Images/product_1.jpg")" />
                        <div class="carousel-caption">
                            <h4>
                                棒球
                            </h4>
                            <p>
                                棒球运动是一种以棒打球为主要特点，集体性、对抗性很强的球类运动项目，在美国、日本尤为盛行。
                            </p>
                        </div>
                    </div>
                    <div class="item">
                        <img alt="" src="@Url.Content("~/Images/product_1.jpg")" />
                        <div class="carousel-caption">
                            <h4>
                                冲浪
                            </h4>
                            <p>
                                冲浪是以海浪为动力，利用自身的高超技巧和平衡能力，搏击海浪的一项运动。运动员站立在冲浪板上，或利用腹板、跪板、充气的橡皮垫、划艇、皮艇等驾驭海浪的一项水上运动。
                            </p>
                        </div>
                    </div>
                    <div class="item active">
                        <img alt="" src="@Url.Content("~/Images/product_1.jpg")" />
                        <div class="carousel-caption">
                            <h4>
                                自行车
                            </h4>
                            <p>
                                以自行车为工具比赛骑行速度的体育运动。1896年第一届奥林匹克运动会上被列为正式比赛项目。环法赛为最著名的世界自行车锦标赛。
                            </p>
                        </div>
                    </div>
                </div> <a data-slide="prev" href="#carousel-635530" class="left carousel-control">‹</a> <a data-slide="next" href="#carousel-635530" class="right carousel-control">›</a>
            </div>
            <div class="row-fluid">
                <div class="span8">
                    <div class="row-fluid">
                        <div class="span6">
                            <h1>
                                <strong>作品展示</strong>
                            </h1>
                        </div>
                        <div class="span6">
                            <form class="form-search form-inline">
                                <input class="input-medium search-query" type="text" /><button class="btn" type="submit">查找</button>
                            </form>
                        </div>
                    </div>
                    <div class="tabbable" id="tabs-535829">
                        <ul class="nav nav-tabs">
                            <li class="active">
                                <a href="#panel-138333" data-toggle="tab">动漫</a>
                            </li>
                            <li>
                                <a href="#panel-73669" data-toggle="tab">游戏</a>
                            </li>
                        </ul>
                        <div class="tab-content">
                            <div class="tab-pane active" id="panel-138333">
                                <p>
                                    第一部分内容.
                                </p>
                            </div>
                            <div class="tab-pane" id="panel-73669">
                                <p>
                                    第二部分内容.
                                </p>
                                <div class="row">
                                    <div class="twopage-courses col-md-4">
                                        <a href="www.baidu.com">
                                            <img style="width:100%;height:100%" src="@Url.Content("~/Images/product_1.jpg")" alt="" />
                                            <div class="classicon">
                                                <h1><strong>「作品一」</strong></h1>

                                            </div>
                                        </a>
                                    </div>
                                    <div class="twopage-courses col-md-4">
                                        <a href="www.baidu.com">
                                            <img style="width:100%;height:100%" src="@Url.Content("~/Images/product_1.jpg")" alt="" />
                                            <div class="classicon">
                                                <h1><strong>「作品二」</strong></h1>
                                            </div>
                                        </a>
                                    </div>
                                    <div class="twopage-courses col-md-4">
                                        <a href="www.baidu.com">
                                            <img style="width:100%;height:100%" src="@Url.Content("~/Images/product_1.jpg")" alt="" />
                                            <div class="classicon">
                                                <img style="width:100px;height:50px;margin-top:100px;" src="images/logopng版.png" alt="Alternate Text" />
                                                <h1><strong>「作品三」</strong></h1>
                                            </div>
                                        </a>
                                    </div>
                                </div>

                                @*<div class="row">
                                    <div class="text-center article-text col-md-4 col-md-offset-4" style="background-color: #ccc; margin-top: 100px; margin-bottom:20px;">
                                        专业视频
                                    </div>
                                </div>

                                <div class="products col-md-4">
                                    <a class="pro" href="">
                                        <img class="proimage" src="@Url.Content("~/Images/product_1.jpg")" alt="Alternate Text" />
                                    </a>
                                </div>
                                <div class="products col-md-4">
                                    <a class="pro" href="">
                                        <img class="proimage" src="@Url.Content("~/Images/product_1.jpg")" alt="Alternate Text" />
                                    </a>
                                </div>*@
                            </div>
                        </div>
                    </div>
                    @*<div class="media">
                        <a href="#" class="pull-left"><img src="@Url.Content("~/Images/product_1.jpg")" class="media-object" alt='' /></a>
                        <div class="media-body">
                            <h4 class="media-heading">
                                嵌入媒体标题
                            </h4> 请尽量使用HTML5兼容的视频格式和视频代码实现视频播放, 以达到更好的体验效果.
                        </div>
                    </div>*@
                </div>
                <div class="span4">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>
                                    编号
                                </th>
                                <th>
                                    作品名称
                                </th>
                                <th>
                                    提交时间
                                </th>
                                <th>
                                    访问量
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>
                                    1
                                </td>
                                <td>
                                    TB - Monthly
                                </td>
                                <td>
                                    01/04/2012
                                </td>
                                <td>
                                    Default
                                </td>
                            </tr>
                            <tr class="success">
                                <td>
                                    1
                                </td>
                                <td>
                                    TB - Monthly
                                </td>
                                <td>
                                    01/04/2012
                                </td>
                                <td>
                                    Approved
                                </td>
                            </tr>
                            <tr class="error">
                                <td>
                                    2
                                </td>
                                <td>
                                    TB - Monthly
                                </td>
                                <td>
                                    02/04/2012
                                </td>
                                <td>
                                    Declined
                                </td>
                            </tr>
                            <tr class="warning">
                                <td>
                                    3
                                </td>
                                <td>
                                    TB - Monthly
                                </td>
                                <td>
                                    03/04/2012
                                </td>
                                <td>
                                    Pending
                                </td>
                            </tr>
                            <tr class="info">
                                <td>
                                    4
                                </td>
                                <td>
                                    TB - Monthly
                                </td>
                                <td>
                                    04/04/2012
                                </td>
                                <td>
                                    Call in to confirm
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>